<div class="well">
    <h5>
        <i class="fa fa-warning"></i>
        <strong class="">开考后在进场时间内进入考场，超过进场时间，将不能参加考试！！！</strong>
        <small>状态为练习的考场，可以不限进入，只记录最后一次得分、试卷。</small>
    </h5>
</div>
<div class="panel panel-default">
    <div class="panel-heading">
        <h5>考场列表</h5>
    </div>
    <div class="container-fluid">
        <table class="table" id="listTable">
            <thead>
            <tr>
                <th>考场名称</th>
                <th>状态</th>
                <th>开考时间</th>
                <th>进场时间</th>
                <th>得分</th>
                <?php if ($user['level'] < 7) { ?>
                    <th style="max-width: 200px;"></th>
                <?php } ?>
            </tr>
            </thead>
            <tbody>
            <?php foreach ($rooms as $room) : ?>
                <tr id="<?= $room['id'] ?>">
                    <td><?= $room['name'] ?></td>
                    <td><?= $room['stat'] ? '练习' : '考试' ?></td>
                    <td data-time="time"><?= $room['time'] ?></td>
                    <td data-end="<?= $room['start'] ?>"><?= $room['start'] ? $room['start'] . ' 分钟' : "不限" ?></td>
                    <td><?php if ($user['level'] >= 7) { ?>
                            <button class="btn btn-primary statTest" type="button">
                                <i class="fa fa-bar-chart"></i>
                                得分统计
                            </button>
                        <?php } else {
                            echo $room['score'] != null ? $room['score'] : "未参加考试";
                        } ?></td>
                    <?php if ($user['level'] < 7) { ?>
                    <td>
                        <div class="btn-group">
                            <?php if ($room['score'] == null || $room['stat'] == 1) { ?>
                                <button class="btn btn-primary takeTest" type="button">
                                    <i class="fa fa-sign-in"></i>
                                    进入考场
                                </button>
                            <?php }
                            if ($room['score'] != null) { ?>
                                <button class="btn btn-info viewTest" data-exam-id="<?= $room['exam_page_id'] ?>" type="button">
                                    <i class="fa fa-eye"></i>
                                    查看试卷
                                </button>
                            <?php } ?>
                        </div>
                        <?php } ?>
                    </td>
                </tr>
            <?php endforeach; ?>
            </tbody>
        </table>
    </div>
</div>
<?php if ($user['level'] < 7) { ?>
    <div class="panel panel-default">
        <div class="panel-body">
            <div id="score" style="height: 250px;"></div>
        </div>
    </div>
<?php } ?>

<link rel="stylesheet" type="text/css" media="screen" href="<?= THEMEPATH ?>/css/dataTables.bootstrap.min.css"/>

<script src="<?= THEMEPATH ?>/js/jquery.dataTables.min.js"></script>
<script src="<?= THEMEPATH ?>/js/dataTables.bootstrap.min.js"></script>
<script src="<?= THEMEPATH ?>/js/echarts.min.js"></script>

<script type="text/javascript">
    $(function () {
        $('#listTable').DataTable({
            language: {
                'url': '<?=THEMEPATH?>/js/dataTables.zh-CN.json'
            },
            "processing": true,
            'searching': false,
            'order': [[1, 'desc']]
        });
        <?php if ($user['level']<7) {?>
        var option = {
            title: {
                text: '得分统计'
            },
            tooltip: {
                trigger: 'axis'
            },
            xAxis: {
                data: <?=$time?>
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name: '分数',
                    type: 'line',
                    data:<?=$score?>
                }
            ]
        };

        var myChart = echarts.init(document.getElementById('score'));
        myChart.setOption(option);

        $('#listTable').on('click', '.takeTest', function () {
            var start = $(this).parent('td').prevAll('[data-time=time]').text();
            var end = $(this).parent('td').prevAll('[data-end]').data('end');
            start = new Date(start.replace(/-/g, "/"));
            var time = new Date();
            var pass = (time - start) / 60000;

            if (end != 0 && pass > end) {
                alert('已开考 ' + pass.toFixed(0) + ' 分钟，超过进场时间' + end + '分钟限制，已经不能参加考试。');
                return false;
            } else {
                var id = $(this).parents('tr').attr('id');
                var opt = 'top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no';
                var tmp = window.open("<?=site_url('main/take')?>/" + id, "_blank", opt);
                tmp.moveTo(0, 1);
                tmp.resizeTo(screen.availWidth, screen.availHeight);
                tmp.focus();
            }
        });

        $('#listTable').on('click', '.viewTest', function () {
            var id = $(this).data('exam-id');
            var opt = 'top=0, left=0, toolbar=no, menubar=no, scrollbars=yes, resizable=no,location=no, status=no';
            var tmp = window.open("<?=site_url('test/view')?>/" + id, "_blank", opt);
            tmp.moveTo(0, 1);
            tmp.resizeTo(screen.availWidth, screen.availHeight);
            tmp.focus();
        });
        <?php } else {?>
        $('#listTable').on('click', '.statTest', function () {
            var id = $(this).parents('tr').attr('id');
            $('.main-content').load('<?=site_url("admin/stat")?>/'+id);
        });
        <?php } ?>
    });
</script>